import React from 'react';
import {Tabs} from 'antd';
const TabPane = Tabs.TabPane;

import QueueAnim from 'rc-queue-anim';

import PayTimeRecord from './PayTimeRecord';

import PayTimeInfo from './PayTimeInfo';

class Product extends React.Component{
  constructor(props) {
    super(props);

    this.state = {
        isAdd:false,
        editItem:{}
    };
  }
  componentDidMount(){

  }
  _t(value){
    this.setState({
      editItem:{},
      isAdd:value
    })
  }
  _editClass(record,index){
    this.setState({
      isAdd:false,
      editItem:{...record}
    })
  }
  render(){
    let _content = this.state.isAdd?
        [
            <PayTimeInfo key="info" changeAdd={this._t.bind(this)} editItem = {this.state.editItem}/>
        ]:
        [
            <PayTimeRecord key="table" changeAdd={this._t.bind(this)} editItem = {this.state.editItem}/>
        ]
    return (
        <QueueAnim
            key="demo"
            type={['left', 'right']}
            style={{height:'100%'}}
            ease={['easeOutQuart', 'easeInOutQuart']}
          >
          {_content}
        </QueueAnim>
    )
  }
}

export default Product;
